body {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

}



body .container {

    width: 100%;

    height: auto;

    display: flex;

    justify-content: center;

}



body .header {

    z-index: 99;

    width: 100%;

    height: 100px;

    display: flex;

    justify-content: center;

    /* background: url('../images/index/bg-20p.png'); */

    background-color: #ffffff;

    border-bottom: 1px solid #e0e0e0;

}



body .header-main {

    width: 1200px;

    height: 63px;

    display: flex;

    margin-top: 30px;

}



body .header-main .logo {

    width: 431px;

    height: 63px;

}



body .header-main .logo img {

    position: relative;

    top: -7px;

    max-width: 100%;

}



body .header-main .logo.mobile {

    display: none;

}



body .header-main .nav {

    display: flex;

    justify-content: flex-end;

    width: 869px;

    height: 63px;

}



body .header-main .nav .active {

    color: #0084ff;

}



body .header-main .m-nav-icon {

    display: none;

}



body .header-main .nav > ul {

    display: flex;

    justify-content: flex-start;

}



body .header-main .nav > ul li {

    position: relative;

}



body .header-main li {

    width: auto;

    height: 63px;

}



.nav ul > li:hover ul {

    visibility: visible;

    opacity: 1;

    filter: alpha(opacity=100);

}



.nav li ul {

    position: absolute;

    width: 140px;

    left: 0;

    top: 50px;

    z-index: 1;

    visibility: hidden;

    opacity: 0;

    filter: alpha(opacity=0);

    -webkit-transition: 200ms ease;

    -moz-transition: 200ms ease;

    -o-transition: 200ms ease;

    transition: 200ms ease;

    background-color: #f0efef;

}



.nav li ul li {

    width: 100%;

    height: 45px;

    text-align: center;

}



.nav li ul li a {

    line-height: 47px;

}



body .header-main li a {

    display: inline-block;

    width: auto;

    height: 100%;

    color: #000000;

    font-size: 18px;

    line-height: 30px;

    text-decoration: none;

    text-align: center;

    transition: 0.4s;

}



body .header-main li a:hover {

    color: #0084ff;

}



body .header-main li .search {

    cursor: pointer;

}



body .header-main li .search img {

    max-width: 100%;

    margin-top: 10px;

}



body .header-main .nav > ul > li > a:after {

    content: '';

    color: #fff;

    font-size: 30px;

    font-weight: 900;

    text-align: center;

    position: relative;

    margin: 0 17px;

    top: -19px;

}



body .header-main li:last-child:after {

    content: none;

}



body .header-main .close-btn {

    display: none;

}



body .header-main .search-form {

    display: none;

}



body {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

}



body .container {

    width: 100%;

    height: auto;

    display: flex;

    justify-content: center;

}



body .header {

    z-index: 99;

    width: 100%;

    height: 100px;

    display: flex;

    justify-content: center;

    /* background: url('../images/index/bg-20p.png'); */

    background-color: #ffffff;

    border-bottom: 1px solid #e0e0e0;

}



body .header-main {

    width: 1200px;

    height: 63px;

    display: flex;

    margin-top: 30px;

}



body .header-main .logo {

    width: 431px;

    height: 63px;

}



body .header-main .logo img {

    position: relative;

    top: -7px;

    max-width: 100%;

}



body .header-main .logo.mobile {

    display: none;

}



body .header-main .nav {

    display: flex;

    justify-content: flex-end;

    width: 869px;

    height: 63px;

}



body .header-main .nav .active {

    color: #d02541;

}



body .header-main .m-nav-icon {

    display: none;

}



body .header-main .nav > ul {

    display: flex;

    justify-content: flex-start;

}



body .header-main .nav > ul li {

    position: relative;

    padding: 0 15px;

}



body .header-main li {

    width: auto;

    height: 63px;

}



.nav ul > li:hover ul {

    visibility: visible;

    opacity: 1;

    filter: alpha(opacity=100);

}



.nav li ul {

    position: absolute;

    width: 140px;

    left: 0;

    top: 50px;

    z-index: 1;

    visibility: hidden;

    opacity: 0;

    filter: alpha(opacity=0);

    -webkit-transition: 200ms ease;

    -moz-transition: 200ms ease;

    -o-transition: 200ms ease;

    transition: 200ms ease;

    background-color: #f0efef;

}



.nav li ul li {

    width: 100%;

    height: 45px;

    text-align: center;

}



.nav li ul li a {

    line-height: 47px;

}



body .header-main li a {

    display: inline-block;

    width: auto;

    height: 100%;

    color: #000000;

    font-size: 18px;

    line-height: 30px;

    text-decoration: none;

    text-align: center;

    transition: 0.4s;

}



body .header-main li a:hover {

    color: #d02541;

}



body .header-main li .search {

    cursor: pointer;

}



body .header-main li .search img {

    max-width: 100%;

    margin-top: 10px;

}



body .header-main .nav > ul > li > a:after {

    content: '';

    color: #fff;

    font-size: 30px;

    font-weight: 900;

    text-align: center;

    position: relative;

    margin: 0 17px;

    top: -19px;

}



body .header-main li:last-child:after {

    content: none;

}



body .header-main .close-btn {

    display: none;

}



body .header-main .search-form {

    display: none;

}



body .banner {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 100%;

    height: 380px;

}



body .banner .category-title {

    display: flex;

    align-items: center;

    justify-content: flex-end;

    width: 223px;

    height: 146px;

    background: url('../images/title-style.png') no-repeat;

    background-size: 85% 100%;

    margin-top: 28px;

}



body .banner .category-title h3 {

    font-size: 36px;

    color: #e7e4e4;

}



.to-top {

    position: fixed;

    right: 30px;

    bottom: 30px;

    z-index: 9999;

}



.to-top a {

    display: block;

    width: 50px;

    height: 50px;

    background: #eceded;

    text-align: center;

    color: white;

    border-radius: 3px;

    line-height: 16px;

}



.to-top .to-top-btn a {

    background: #ffffff url('../images/top.png') no-repeat center;

    background-size: 80% 80%;

    box-shadow: 3px 3px 10px #b5b5b5;

    transition: all .35s;

}



.to-top .to-top-btn a:hover {

    transform: scale(1.1);

}



.search-box {

    display: none;

}



.search-box .mask {

    z-index: 999;

    position: fixed;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    background-color: #000;

    opacity: 0.3;

}



.search-box .search-input-box {

    z-index: 999;

    position: fixed;

    top: 0;

    left: 0;

    width: 712px;

    height: auto;

}



.search-box .search-input-box input {

    width: 600px;

    height: 60px;

    outline: none;

    border: 0;

    font-size: 22px;

    padding-left: 10px;

    float: left;

}



.search-box .search-input-box .btn {

    display: flex;

    justify-content: center;

    align-items: center;

    width: 100px;

    height: 62px;

    background: #d72323;

    float: left;

}



.search-box .search-input-box .btn img {

    width: 35px;

}



.page-title {

    display: flex;

    justify-content: center;

    width: 100%;

    height: 40px;

    background-color: #f0efef;

}



.page-title .title-box {

    display: flex;

    justify-content: space-between;

    align-items: center;

    width: 1200px;

    height: inherit;

}



.page-title .title-box .title-text {

    font-size: 20px;

    font-weight: bold;

    line-height: 48px;

    color: #333333;

}



.nav-bar ul {

    font-size: 16px;

    display: flex;

}



.nav-bar ul a {

    color: #333333;

    font-size: 16px;

    text-decoration: none;

    font-weight: bold;

}



.nav-bar ul li:last-child a {

    color: #d72323;

}



.nav-bar ul li:first-child:after {

    position: relative;

    top: -5px;

}



.nav-bar ul li:last-child:after {

    content: none;

}



.nav-bar ul img {

    position: relative;

    top: -1px;

}



.page-body {

    width: 1200px;

    height: auto;

    margin: 62px 0;

}



.page-body .product {

    display: flex;

    flex-wrap: wrap;

    align-items: flex-start;

    justify-content: space-between;

    width: 100%;

    height: inherit;

}



.m-category {

    display: none;

    width: 100%;

    height: 50px;

    overflow: hidden;

}



.left-category {

    width: 265px;

}



.left-category .search-input {

    display: flex;

    align-items: center;

    justify-content: center;

    margin: 25px 0;

    background: #ffffff;

    width: 265px;

    height: 37px;

    border-radius: 5px;

    overflow: hidden;

}



.left-category .search-input form {

    width: 220px;

    height: 30px;

}



.left-category .search-input input {

    width: 215px;

    height: 28px;

    outline: none;

    border: none;

    font-size: 13px;

    padding-left: 5px;

}



.left-category .search-input .btn {

    z-index: 999;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 48px;

    height: inherit;

    background-color: #d72323;

    cursor: pointer;

}



.left-category .search-input .btn img {

    width: 18px;

    height: 18px;

}



.current-category {

    display: flex;

    align-items: center;

    width: 265px;

    height: 100px;

    background: #d72323;

}



.current-category .cn-title {

    font-size: 17px;

    font-weight: bold;

    color: #ffffff;

    margin: 0 22px;

}



.current-category .en-title {

    font-size: 17px;

    color: #ffffff;

    opacity: 0.5;

}



.category-list-item {

    display: flex;

    justify-content: center;

    width: 265px;

    background: #fff;

    border-radius: 0 0 20px 20px;

}



.category-list-item li {

    width: 239px;

    height: 79px;

    border-bottom: 1px solid rgba(0, 0, 0, 0.205);

}



.category-list-item li a {

    width: 100%;

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: space-between;

    text-decoration: none;

    color: #333333;

    font-size: 15px;

}



.category-list-item li.active a,

.category-list-item li:hover a {

    color: #d72323;

}



.category-list-item li:last-child {

    border: none;

}



.recommend-product {

    width: 265px;

    height: auto;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    background: #fff;

    border-top: 3px solid #d72323;

}



.recommend-product .r-product-box {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    width: 216px;

    height: auto;

}



.recommend-product .r-product-box .title {

    width: 205px;

    height: 85px;

    padding-top: 30px;

}



.recommend-product .r-product-box .cn-title {

    font-size: 18px;

    color: #d72323;

    font-weight: bold;

}



.recommend-product .r-product-box .en-title {

    font-size: 11px;

    color: #333333;

    opacity: 0.5;

    margin-top: 11px;

    margin-bottom: 15px;

}



.recommend-product .r-product-box .line {

    width: 24px;

    height: 4px;

    background: #d72323;

}



.r-product-list {

    width: 100%;

    height: auto;

}



.r-product-list ul {

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

}



.r-product-list li {

    margin: 24px 10px;

}



.r-product-list .product {

    width: 88px;

    height: auto;

}



.r-product-list .product img {

    width: 100%;

    height: 73px;

}



.r-product-list .product h3 {

    display: block;

    width: 100%;

    font-size: 15px;

    color: #333333;

    line-height: 48px;

}



.r-product-list .product a {

    font-size: 13px;

    text-decoration: none;

    color: #d72323;

}



.product-list-box {

    width: 900px;

    display: flex;

    flex-wrap: wrap;

}



.product-list-box .list-item {

    width: 100%;

    height: auto;

}



.product-list-box .list-item ul {

    display: flex;

    flex-wrap: wrap;

}



.product-list-box .list-item li {

    margin-right: 22.5px;

    margin-bottom: 22px;

    float: left;

}



.product-list-box .list-item li:nth-child(3n) {

    margin-right: 0;

}



.product-list-box .item {

    width: 285px;

    height: 360px;

    background: #fff;

}



.product-list-box .item .cover {

    width: 100%;

    height: 278px;

    overflow: hidden;

}



.product-list-box .item img {

    width: 100%;

    height: 100%;

    transition: all 0.3s;

    object-fit: cover;

}



.product-list-box .item a {

    text-decoration: none;

}



.product-list-box .item .title {

    width: 100%;

    height: 80px;

    font-size: 12px;

    color: #333333;

    text-align: center;

    font-weight: bold;

    line-height: 80px;

}



.product-list-box .item:hover img {

    transform: scale(1.2);

}



.case-list-box {

    width: 900px;

    display: flex;

    flex-wrap: wrap;

}



.case-list-box .list-item {

    width: 100%;

    height: auto;

}



.case-list-box .list-item ul {

    display: flex;

    flex-wrap: wrap;

}



.case-list-box .list-item li {

    margin-bottom: 20px;

    margin-right: 15px;

    float: left;

}



.case-list-box .list-item li:nth-child(3n) {

    margin-right: 0;

}



.case-list-box .item {

    width: 290px;

    height: 202px;

    background: #fff;

    overflow: hidden;

}



.case-list-box .item a {

    display: block;

    width: 100%;

    height: 100%;

    position: relative;

    text-decoration: none;

}



.case-list-box img {

    width: 100%;

    position: absolute;

}



.case-list-box .title {

    display: flex;

    justify-content: center;

    align-items: center;

    flex-wrap: wrap;

    position: absolute;

    top: 0;

    width: 290px;

    height: 202px;

    opacity: 0;

    transition: all 0.35s;

}



.case-list-box .title .mask {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: #000000;

    opacity: 0.5;

}



.case-list-box .title .text {

    z-index: 1;

    font-size: 14px;

    color: #ffffff;

    padding: 16px;

    border: 4px solid #ffffff;

}



.case-list-box .title:hover {

    opacity: 1;

}



.case-main,

.case-body {

    width: 900px;

    height: auto;

}



.product-main,

.product-body {

    width: 900px;

    height: auto;

}



.page-bar {

    width: 100%;

    height: 42px;

    text-align: center;

}



.page-bar li {

    display: inline;

    margin: 0 17px;

}



.page-bar li a {

    display: inline-block;

    border-radius: 21px;

    padding: 14px 26px;

    text-decoration: none;

    font-size: 14px;

    color: #333333;

    background: #fff;

    transition: all 0.35s;

    border: 1px solid #eee;

}



.page-bar li a:hover,

.page-bar li .current {

    color: #fff;

    background: #18b3f9;

}



.feedback {

    display: flex;

    justify-content: space-between;

    width: 100%;

    height: auto;

}



.feedback .feedback-img {

    width: 800px;

    height: auto;

}



.feedback .feedback-img img {

    max-width: 100%;

}



.feedback .form-control {

    width: 450px;

    height: auto;

    margin-top: 20px;

}



.feedback .form-control .input-item {

    width: 100%;

    height: auto;

    margin-bottom: 20px;

    font-size: 14px;

    display: flex;

    align-items: center;

    justify-content: space-between;

}



.feedback .form-control input {

    width: 85%;

    height: 35px;

}



.feedback .form-control textarea {

    width: 85%;

    height: 200px;

}



.feedback .form-control input,

.feedback .form-control textarea {

    outline: none;

    border: 1px solid #ababab;

    transition: all 0.25s;

}



.feedback .form-control textarea:focus,

.feedback .form-control input:focus {

    border: 1px solid #f00;

    box-shadow: 0 0 5px #ff4e4e;

}



.feedback .btn {

    cursor: pointer;

    display: inline-block;

    width: 130px;

    height: 50px;

    line-height: 50px;

    text-align: center;

    border: 1px solid #eee;

    text-decoration: none;

    margin: 0;

    padding: 0;

    outline: none;

    border-radius: 5px;

    background: none;

}



.feedback .btn.submit {

    width: 60%;

    color: #ffffff;

    background: #6397ec;

}



.feedback .btn.submit:hover {

    background: #3b81f1;

}



.feedback .btn.cancel {

    width: 35%;

    color: #666666;

}



.feedback .btn.cancel:hover {

    background: #d8d8d8;

}



.footer {

    display: flex;

    flex-direction: column;

    align-items: center;

    width: 100%;

    height: 400px;

    background: #dbd9d9;

}



.footer .main {

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

    width: 1200px;

    height: 285px;

    margin-top: 73px;

    margin-bottom: 10px;

}



.footer .footer-title {

    width: 100%;

    height: auto;

    font-size: 15px;

    margin-bottom: 40px;

    font-weight: bold;

}



.footer .foot-item {

    width: auto;

    height: auto;

    overflow: hidden;

}



.footer .copyright {

    display: flex;

    align-items: center;

    width: 1200px;

    height: 31px;

    border-top: 1px solid #c5c3c3;

}



.foot-item.news {

    height: 220px;

}



.foot-item.news .list {

    width: 250px;

}



.foot-item.news .list li {

    display: block;

    width: 100%;

    height: 14px;

    line-height: 14px;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 1;

    overflow: hidden;

    margin-bottom: 16px;

}



.foot-item.news .list a {

    color: #000;

    font-size: 13px;

    text-decoration: none;

}



.foot-item.product {

    height: 220px;

    margin-left: -55px;

}



.foot-item.product .list {

    width: 210px;

}



.foot-item.product ul {

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

}



.foot-item.product li {

    display: block;

    width: 65px;

    height: 50px;

    margin-bottom: 5px;

    overflow: hidden;

}



.foot-item.product li a {

    text-decoration: none;

    display: block;

    width: 100%;

    height: 100%;

}



.foot-item.product img {

    transition: all 0.35s;

    width: 100%;

}



.foot-item.product li:hover img {

    transform: scale(1.2);

}



.foot-item.flink {

    height: 220px;

    margin-left: -10px;

    border-right: 1px solid #cac8c8;

}



.foot-item.flink .list {

    width: 200px;

}



.foot-item.flink .list li {

    display: block;

    width: 60%;

    height: 14px;

    line-height: 14px;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 1;

    overflow: hidden;

    margin-bottom: 16px;

}



.foot-item.flink .list li a {

    color: #000;

    font-size: 13px;

    text-decoration: none;

}



.foot-item.description {

    margin-top: -15px;

}



.foot-item.description .contact {

    width: 272px;

    height: 230px;

}



.foot-item.description .logo img {

    width: 272px;

    height: 40px;

}



.foot-item.description .share-group {

    width: 100%;

}



.foot-item.description .share-group ul {

    display: flex;

}



.foot-item.description .share-group li {

    margin: 25px 14px 0 0;

}



.foot-item.description .share-group img {

    width: 28px;

    height: 28px;

}



.foot-item.description .address {

    width: 100%;

    font-size: 13px;

}



.foot-item.description .address li {

    margin-top: 20px;

}



.foot-item.description .address span {

    line-height: 24px;

}



.foot-item.description .address a {

    color: #000000;

    text-decoration: none;

}



.foot-item.description .address .iconfont {

    font-size: 16px;

    padding-right: 15px;

}



.copyright .map-item {

    width: 100%;

    height: 13px;

    margin: 15px 0;

}



.copyright .map-item ul {

    display: flex;

    justify-content: flex-start;

}



.copyright .map-item li:after {

    content: url('../images/icon-5.png');

    margin: 0 12px 0 8px;

}



.copyright .map-item li:last-child:after {

    content: none;

}



.copyright .map-item a {

    color: #333333;

    font-size: 12px;

    text-decoration: none;

}



.copyright .detail {

    color: #7d7c7c;

    font-size: 12px;

}



.copyright .detail a {

    color: #7d7c7c;

    text-decoration: none;

}



.copyright .detail .cr {

    margin-right: 10px;

}



.m-nav {

    display: none;

}



.about-category {

    width: 100%;

    height: auto;

    display: flex;

    justify-content: center;

}



.about-category .ac-main {

    width: 1200px;

    height: auto;

    border-bottom: 1px solid #ececec;

}



.about-category ul {

    display: flex;

    justify-content: flex-start;

}



.about-category li {

    position: relative;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    width: 155px;

    height: inherit;

    margin: 10px 0;

}



.about-category li:hover,

.about-category li.active {

    color: #fff;

    background-color: #ff434f;

    transition: all 0.35s;

}



.about-category li:hover a,

.about-category li.active a {

    color: #fff;

    font-weight: bold;

}



.about-category a {

    display: block;

    width: 100%;

    height: 100%;

    text-decoration: none;

    font-size: 22px;

    color: #000;

    line-height: 85px;

    text-align: center;

}



.about-category li:hover:after,

.about-category li.active:after {

    content: '-';

    position: absolute;

    bottom: 15px;

    left: 48%;

    width: 11px;

    height: 11px;

}



.about-main {

    width: 100%;

    height: auto;

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    justify-content: space-between;

}



.about-main .about-text {

    width: 511px;

    height: auto;

    font-size: 15px;

    line-height: 38px;

    text-indent: 2em;

}



.about-main .about-img {

    width: 657px;

    height: auto;

}



.about-main .about-img img {

    max-width: 100%;

}



.team-main {

    width: 100%;

    height: auto;

}



.team-main ul {

    display: flex;

    justify-content: space-between;

}



.team-main li {

    position: relative;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    width: 212px;

    height: 561px;

    color: #fff;

    background-color: #3d6cb9;

    margin-top: 56px;

    padding-bottom: 25px;

    text-align: center;

}



.team-main li:nth-child(2n) {

    margin-top: 0;

    background-color: #e77b7b;

}



.team-main .title {

    width: 155px;

    height: 66px;

    line-height: 66px;

    font-size: 20px;

}



.team-main .text {

    width: 155px;

    height: 330px;

    font-size: 12px;

    line-height: 20px;

}



.team-main .img {

    width: 100%;

    height: 115px;

    margin-top: 25px;

}



.team-main .img img {

    max-width: 155px;

}



.team-main li:nth-child(2n) .img {

    position: absolute;

    top: 0;

    left: 0;

}



.team-main li:nth-child(2n) .title {

    margin-top: 142px;

}



.news-main {

    display: flex;

    flex-wrap: wrap;

    align-items: flex-start;

    justify-content: space-between;

    width: 1200px;

    height: auto;

}



.news-main .news-box {

    width: 870px;

    height: auto;

}



.news-main .news-item {

    width: 100%;

    height: auto;

}



.news-main .news-item li {

    margin-bottom: 65px;

}



.news-main .item {

    width: 100%;

    height: 126px;

}



.news-main .item .cover {

    width: 191px;

    height: 126px;

    overflow: hidden;

}



.news-main .item img {

    max-width: 100%;

    transition: all 0.35s;

}



.news-main .item .detail {

    width: 673px;

}



.news-main .item a {

    display: flex;

    align-items: center;

    justify-content: space-between;

    color: #333333;

    text-decoration: none;

    transition: all 0.35s;

}



.news-main .item .title {

    width: 100%;

    height: 25px;

    font-size: 23px;

    line-height: 25px;

    transition: all 0.35s;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 1;

    overflow: hidden;

}



.news-main .item a:hover .title {

    color: #18b3f9;

}



.news-main .item a:hover img {

    transform: scale(1.2);

}



.news-main .item .description {

    width: 100%;

    height: 35px;

    font-size: 13px;

    line-height: 18px;

    margin: 25px 0;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 2;

    overflow: hidden;

}



.news-main .item .datetime {

    font-size: 13px;

}



.news-main .recommend-news {

    width: 300px;

    height: auto;

    border-top: 3px solid #d72323;

    background-color: #f7f7f7;

}



.news-main .r-news-box {

    width: 100%;

    height: auto;

    display: flex;

    flex-wrap: wrap;

    align-content: baseline;

    justify-content: center;

}



.news-main .r-news-box .title {

    width: 272px;

    height: 85px;

    padding-top: 45px;

}



.news-main .r-news-box .cn-title {

    font-size: 25px;

    color: #d72323;

    font-weight: bold;

}



.news-main .r-news-box .en-title {

    font-size: 15px;

    color: #333333;

    opacity: 0.5;

    margin-top: 15px;

    margin-bottom: 15px;

}



.news-main .r-news-box .line {

    width: 24px;

    height: 4px;

    background: #d72323;

}



.news-main .r-news-list {

    width: 272px;

    height: auto;

    margin-top: 45px;

}



.news-main .r-news-list li {

    margin-bottom: 55px;

}



.news-main .r-news-list a {

    display: block;

    width: 100%;

    height: 191px;

    color: #333333;

    text-decoration: none;

    transition: all 0.35s;

}



.news-main .r-news-list a:hover {

    color: #18b3f9;

}



.news-main .r-news-list .cover {

    width: 100%;

    height: 162px;

    overflow: hidden;

}



.news-main .r-news-list .cover img {

    width: 100%;

}



.news-main .r-news-list .n-title {

    width: 100%;

    height: 15px;

    font-size: 12px;

    line-height: 15px;

    margin-top: 15px;

    text-align: center;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 1;

    overflow: hidden;

}



.news-header {

    width: 100%;

    height: auto;

    border-bottom: 1px solid #b2b2b2;

}



.news-header .title {

    font-size: 25px;

}



.news-header .datetime {

    font-size: 14px;

    margin: 30px 0;

    color: #585858;

}



.news-header .datetime span {

    margin-right: 10px;

}



.news-body {

    padding: 40px 0;

}



.news-body img {

    max-width: 100%;

}



.news-footer {

    display: flex;

    align-items: center;

    justify-content: space-between;

    width: 100%;

    height: 70px;

}



.news-footer .news-nav {

    font-size: 12px;

}



.news-footer .news-nav a:hover,

.news-footer .news-nav li {

    color: #18b3f9;

    margin: 15px 0;

}



.news-footer .news-nav a {

    color: #333333;

    text-decoration: none;

}



.news-footer .back-to-list {

    width: 80px;

    height: auto;

}



.news-footer .back-to-list a {

    display: block;

    width: 100%;

    height: 25px;

    font-size: 12px;

    line-height: 25px;

    text-align: center;

    text-decoration: none;

    border-radius: 10px;

    color: #000;

    border: 1px solid #333333;

    transition: all 0.35s;

}



.news-footer .back-to-list a:hover {

    color: #fff;

    background-color: #d72323;

    border: 1px solid #fff;

}





/* 首页联系我们 */



.section {

    width: 100%;

    height: auto;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

}



.bottom-contact {

    display: flex;

    max-width: 1920px;

    height: 400px;

    overflow: hidden;

}



.bottom-contact .text-box {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 926px;

    height: 100%;

    background-image: url('../images/index/contact-bg.png');

    background-repeat: no-repeat;

}



.bottom-contact .contact-detail {

    width: 500px;

    height: auto;

}



.bottom-contact .contact-detail ul {

    margin-top: 30px;

}



.bottom-contact .contact-detail li {

    display: flex;

    align-items: center;

    margin-top: 20PX;
}



.bottom-contact .contact-detail .contact-title {

    color: #ffffff;

    font-size: 36px;

    font-weight: bold;

}



.bottom-contact .contact-detail .icon {

    width: 57px;

    height: auto;

}



.bottom-contact .contact-detail .content {

    width: 443px;

    height: auto;

}



.bottom-contact .contact-detail img {

    width: 57px;

    height: 57px;

}



.bottom-contact .contact-detail .content {

    padding-left: 25px;

    color: #fff;

}



.bottom-contact .contact-detail h4 {

    font-size: 24px;

}



.bottom-contact .contact-detail p {

    font-weight: bold;

    font-size: 18px;

    line-height: 35px;

}



.bottom-contact .contact-detail p a {

    color: #ffffff;

    text-decoration: none;

}



.bottom-contact .map-box {

    width: 994px;

    height: 100%;

}



.bottom-contact .map-box #mapContainer {

    width: 100%;

    height: 100%;

    overflow: hidden;

    margin: 0;

    font-family: "微软雅黑";

}



.bottom-contact .anchorBL {

    display: none;

}



@media screen and (max-width: 768px) {

    body .header {

        height: auto;

    }



    body .header-main {

        width: 100%;

        background-color: #eeeeee;

        margin: 0;

        display: flex;

        align-items: center;

        justify-content: space-between;

    }



    body .header-main .logo {

        width: 60%;

        display: flex;

        align-items: center;

        padding-left: 10px;

    }



    body .header-main .logo.pc {

        display: none;

    }



    body .header-main .logo.mobile {

        display: flex;

    }



    body .header-main .nav {

        opacity: 0.9;

        display: block;

        position: fixed;

        right: -250px;

        bottom: 0;

        width: 200px;

        height: 100%;

        background-color: #5e7686;

    }



    body .header-main .nav .close-btn {

        display: block;

        width: 50px;

        height: 40px;

        color: #ffffff;

        text-align: center;

        line-height: 40px;

        background-color: #d72323;

        position: absolute;

        left: -50px;

    }



    body .header-main ul {

        display: flex;

        flex-wrap: wrap;

        justify-content: center;

    }



    body .header-main li {

        width: 90%;

        height: auto;

        line-height: 50px;

        text-align: center;

        border-bottom: 1px solid #77828a;

    }



    body .header-main li .search {

        display: none;

    }



    body .header-main li a {

        width: 100%;

        font-size: 18px;

        line-height: unset;

    }



    body .header-main li:last-child {

        border-bottom: 0;

    }



    body .header-main .search-form {

        display: inline;

    }



    body .header-main .search-form input {

        width: 90%;

        height: 30px;

        border: 0;

        outline: none;

    }



    body .header-main .search-form button {

        position: relative;

        border: 0;

        outline: none;

        width: 90%;

        height: 30px;

        color: #ffffff;

        background-color: #18b3f9;

    }



    body .header-main li:after {

        content: none;

    }



    body .header-main .m-nav-icon {

        display: block;

        width: 50px;

        height: 50px;

        font-size: 25px;

        line-height: 50px;

        text-align: center;

    }



    body .banner {

        height: 140px;

        margin: 0;

        background-size: 125% 100%;

        background-position: center;

    }



    body .banner .category-title {

        width: 150px;

        height: 85px;

        margin: 0;

    }



    body .banner .category-title h3 {

        font-size: 23px;

        color: #e7e4e4;

    }



    .page-title {

        height: 50px;

    }



    .page-title .title-box .title-text {

        font-size: 22px;

        margin-left: 10px;

    }



    .nav-bar ul {

        font-size: 12px;

        margin-right: 10px;

    }



    .nav-bar ul li a {

        font-size: 12px;

    }



    .nav-bar ul li:first-child:after {

        top: -3px;

    }



    .nav-bar ul li:first-child img {

        width: 14px;

        height: 14px;

    }



    .m-category {

        display: block;

        margin: 10px 0;

    }



    .m-category .swiper-container {

        width: 100%;

        height: 100%;

    }



    .m-category .swiper-slide {

        text-align: center;

        font-size: 16px;

        /* Center slide text vertically */

        display: -webkit-box;

        display: -ms-flexbox;

        display: -webkit-flex;

        display: flex;

        -webkit-box-pack: center;

        -ms-flex-pack: center;

        -webkit-justify-content: center;

        justify-content: center;

        -webkit-box-align: center;

        -ms-flex-align: center;

        -webkit-align-items: center;

        align-items: center;

    }





    .m-category a {

        width: 100%;

        height: 100%;

        color: #ffffff;

        font-size: 16px;

        text-decoration: none;

        background-color: #c8cfd6;

        line-height: 25px;

        margin: 0 5px;

        display: flex;

        justify-content: center;

        align-items: center;

    }



    .m-category .active a {

        color: #d72323;

    }



    .left-category {

        display: none;

    }



    .product-list-box {

        width: 100%;

        display: flex;

        justify-content: center;

    }



    .product-list-box .list-item {

        width: 90%;

    }



    .product-list-box .list-item ul {

        display: flex;

        flex-wrap: wrap;

        justify-content: space-between;

    }



    .product-list-box .list-item li {

        width: 48%;

        margin: 0 0 15px 0;

    }



    .product-list-box .item {

        width: 100%;

        height: auto;

    }



    .product-list-box .item .cover {

        height: 175px;

    }



    .product-list-box .item img {

        max-width: unset;

    }



    .product-list-box .title {

        height: 30px;

        line-height: 30px;

        display: -webkit-box;

        -webkit-box-orient: vertical;

        -webkit-line-clamp: 1;

        overflow: hidden;

    }



    .case-list-box {

        width: 100%;

        justify-content: center;

    }



    .case-list-box .list-item {

        width: 90%;

    }



    .case-list-box .list-item ul {

        display: flex;

        flex-wrap: wrap;

        justify-content: space-between;

    }



    .case-list-box .list-item li {

        width: 48%;

        margin: 0 0 15px 0;

    }



    .case-list-box .list-item a {

        text-decoration: none;

    }



    .case-list-box .item {

        width: 100%;

        height: auto;

    }



    .case-list-box .title {

        position: static;

        top: 0;

        width: 100%;

        height: 30px;

        opacity: 1;

    }



    .case-list-box .title .mask {

        display: none;

    }



    .case-list-box .title .text {

        width: 100%;

        padding: 0;

        color: #000;

        text-align: center;

        display: -webkit-box;

        -webkit-box-orient: vertical;

        -webkit-line-clamp: 1;

        overflow: hidden;

    }



    .case-list-box img {

        position: static;

        width: 100%;

    }



    .page-body {

        width: 100%;

        margin-top: 0;

        display: flex;

        flex-wrap: wrap;

        justify-content: center;

    }



    .page-bar {

        margin-top: 20px;

    }



    .page-bar li {

        margin: 0;

    }



    .page-bar li a {

        border-radius: unset;

        padding: 10px 10px;

    }



    .about-main {

        width: 90%;

    }



    .about-main .about-img {

        margin-top: 25px;

    }



    .ac-main {

        display: none;

    }



    .team-main {

        width: 90%;

    }



    .team-main .title,

    .team-main .text,

    .team-main .img {

        width: 90%;

    }



    .team-main ul {

        flex-wrap: wrap;

    }



    .team-main li {

        width: 48%;

        margin-top: 0;

        margin-bottom: 12px;

        padding-bottom: 5px;

    }



    .team-main li:nth-child(2n) .img {

        position: static;

    }



    .team-main li:nth-child(2n) .title {

        margin-top: 0;

    }



    .team-main .img img {

        max-width: 100%;

    }



    .news-main {

        width: 100%;

        justify-content: center;

    }



    .news-main .news-box {

        width: 90%;

    }



    .news-main .news-item li {

        margin: 20px 0;

    }



    .news-main .item {

        height: auto;

        border-bottom: 1px solid #eee;

        padding-bottom: 10px;

    }



    .news-main .item a {

        flex-wrap: wrap;

        justify-content: center;

    }



    .news-main .item .cover {

        width: 100%;

        height: auto;

    }



    .news-main .item img {

        width: 100%;

    }



    .news-main .item .title {

        font-size: 17px;

        margin-top: 8px;

    }



    .news-main .item .description {

        font-size: 12px;

        margin: 8px 0;

    }



    .news-main .recommend-news {

        display: flex;

        flex-wrap: wrap;

        justify-content: center;

        width: 100%;

        margin-top: 30px;

    }



    .news-main .r-news-box {

        width: 90%;

    }



    .news-main .r-news-box .title {

        width: 100%;

        padding-top: 10px;

    }



    .news-main .r-news-list {

        width: 100%;

        margin-top: 0;

    }



    .news-main .r-news-list a {

        display: inline;

        width: auto;

        height: auto;

        color: unset;

    }



    .news-main .r-news-list ul {

        display: flex;

        flex-wrap: wrap;

        justify-content: space-between;

    }



    .news-main .r-news-list li {

        width: 48%;

        height: auto;

        margin-bottom: 15px;

    }



    .news-main .r-news-list .cover {

        height: auto;

    }



    .case-main,

    .product-main {

        display: flex;

        justify-content: center;

        width: 100%;

    }



    .case-body,

    .product-body {

        width: 90%;

        height: auto;

        display: flex;

        flex-wrap: wrap;

        justify-content: center;

    }



    .news-header {

        margin-top: 20px;

    }



    .news-header .datetime {

        margin: 14px 0;

    }



    .news-body {

        padding: 15px 0;

    }



    .news-footer .news-nav {

        width: 100%;

    }



    .news-footer .news-nav li {

        width: 100%;

        height: 12px;

        display: -webkit-box;

        -webkit-box-orient: vertical;

        -webkit-line-clamp: 1;

        overflow: hidden;

    }



    .news-footer .back-to-list {

        display: none;

    }



    .footer {

        height: auto;

    }



    .footer .main {

        justify-content: center;

        height: auto;

        margin-top: 10px;

        width: 100%;

    }



    .footer .foot-item {

        width: 90%;

        overflow: unset;

    }



    .footer .footer-title {

        margin-bottom: 13px;

    }



    .footer .copyright {

        display: flex;

        flex-wrap: wrap;

        justify-content: center;

        height: auto;

        width: 100%;

        margin-top: 20px;

    }



    .foot-item.news,

    .foot-item.product,

    .foot-item.flink {

        display: none;

    }



    .foot-item.description {

        margin: 20px 0;

    }



    .foot-item.description .contact {

        width: 100%;

    }



    .copyright .map-item {

        width: 98%;

    }



    .copyright .detail {

        width: 98%;

        padding: 10px 0;

    }



    .feedback {

        width: 90%;

    }



    .feedback .feedback-img {

        display: none;

    }



    /* 首页联系我们 */

    .bottom-contact {

        height: auto;

        flex-wrap: wrap;

    }



    .bottom-contact .text-box {

        width: 100%;

        height: 350px;

        background-size: 100% 100%;

    }



    .bottom-contact .contact-detail {

        width: 90%;

    }



    .bottom-contact .contact-detail .contact-title {

        font-size: 28px;

    }



    .bottom-contact .contact-detail ul {

        margin-top: 10px;

    }



    .bottom-contact .contact-detail li {

        margin-bottom: 20px;

    }



    .bottom-contact .contact-detail h4 {

        font-size: 18px;

    }



    .bottom-contact .contact-detail p {

        font-size: 14px;

        line-height: 20px;

        margin-top: 10px;

    }



    .bottom-contact .contact-detail p a {

        color: #ffffff;

        text-decoration: none;

    }



    .bottom-contact .map-box {

        height: 275px;

    }

}